<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/webjars/bootstrap/3.3.7/css/bootstrap.css}">
    <script th:src="@{/webjars/jquery/1.11.1/jquery.js}"></script>
    <script th:src="@{/webjars/bootstrap/3.3.7/js/bootstrap.js}"></script>
</head>
<body>
<div class="container">
    <form th:action="@{/discount/add}" method="post" style="width: 60%;margin: 50px auto">
        <h1>添加折扣</h1>
        <div class="form-group">
            <label>活动名称</label>
            <input class="form-control" type="text" name="name">
        </div>
        <div class="form-group">
            <label>类型</label>
            <select class="form-control" name="type">
                <option th:text="${'全部'}"></option>
                <option th:text="${'仅会员'}"></option>
            </select>
        </div>
        <div class="form-group">
            <label>折扣类别</label>
            <select class="form-control" name="category.id">
                <option th:each="category:${categoryList}" th:text="${category.name}"
                        th:value="${category.id}"></option>
            </select>
        </div>
        <div class="form-group">
            <label>折扣率</label>
            <input class="form-control" type="text" name="rate" placeholder="请输入0.1到0.95之间的小数">
        </div>
        <div class="form-group">
            <label style="margin-right: 20px">是否限制时间?</label>
            <label class="radio-inline">
                <input type="radio" name="dateLimit" value="true" id="date-limit-yes" checked>有
            </label>
            <label class="radio-inline">
                <input type="radio" name="dateLimit" value="false" id="date-limit-no">没有
            </label>
        </div>
        <div class="form-group" id="form-group-begin">
            <label>活动从</label>
            <input class="form-control" type="date" name="beginDate">
        </div>
        <div class="form-group" id="form-group-end">
            <label>到</label>
            <input class="form-control" type="date" name="endDate">
        </div>

        <button class="btn btn-primary">提交</button>
        <a class="btn btn-link" th:href="@{/discount/list}">返回列表首页</a>
    </form>
    <script type="text/javascript">
        $(function (){
            $("#date-limit-no").click(function (){
               $("#form-group-begin,#form-group-end").slideUp();
            });
            $("#date-limit-yes").click(function (){
               $("#form-group-begin,#form-group-end").slideDown();
            });
        })
    </script>
</div>
</body>
</html>